<html>

<head>
    <title>Express</title>
    <link rel="stylesheet" href="stylesheets/style.css">
    <script src="javascripts/vue.min.js"></script>
    <script src="javascripts/axios.min.js"></script>
</head>

<body >
<div id="app">
    <h1>Express</h1>
    <p>Welcome to Express</p>


    <button @click="start">get user</button>
    <button @click="addPostUser">post user</button>

    <input type="file" @change="selectFile($event.target)">
    <p v-for="item in arr">{{item}}</p>
    <img :src="item" v-for="item in imgArr"/>


    <button @click="start">
        开始 getToken
    </button>
    <button @click="stop">
        停止 getToken
    </button>
</div>
</body>
</div>


</html>
<script>

    new Vue({
        el: '#app',
        data: {
            serverAddress: 'http://localhost:8899/',
            // serverAddress:'http://192.168.1.126:3000',
            arr: '',
            userInfo: {
                username: 'lak',
                password: '110110'
            },
            imgArr: [],
            tokenTimer:''
        },
        methods: {
            getUrlParames(key){
                var sHref = window.location.href;
                var args = sHref.split('?');
                if(args[0] == sHref){
                    return "";
                }
                var arr = args[1].split('&');
                var obj = {};
                for(var i = 0;i< arr.length;i++){
                    var arg = arr[i].split('=');
                    obj[arg[0]] = arg[1];
                }
                return obj[key];
            },
            getUserList() {
                axios.get(this.serverAddress + 'selectUser').then(p => {
                    this.arr = p.data.result.res
                })
            },
            postUserList() {
                axios.post(this.serverAddress + 'selectUser').then(p => {
                    this.arr = p.data.result.res
                })
            },
            addTime() {
                this.userInfo.username = this.userInfo.username + '-' + new Date().valueOf();
                this.userInfo.password = this.userInfo.password + '*' + new Date().valueOf();
            },
            removeTime() {
                this.userInfo = {
                    username: 'lak',
                    password: '110110'
                };
            },
            //增
            addGetUser() {
                this.addTime();
                axios.get(this.serverAddress + 'addUser', {params: this.userInfo}).then(p => {
                    console.log(p)
                    this.getUserList();
                    this.removeTime();
                })
            },
            addPostUser() {
                this.addTime();
                // axios.post(this.serverAddress+'addUser',JSON.stringify(this.userInfo)).then(p => {//127.0.0.1可以
                axios.post(this.serverAddress + 'addUser', this.userInfo).then(p => {//127.0.0.1不行
                    console.log(p)
                    this.postUserList();
                    this.removeTime();
                })
            },
            //删
            deleteUser(id) {
                axios.post(this.serverAddress + 'deleteUser', {userId: id}).then(p => {
                    console.log(p)
                    this.postUserList();
                })
            },
            //改
            modifyUser() {
                axios.post(this.serverAddress + 'addUser', this.userInfo).then(p => {
                    console.log(p)
                    this.postUserList();
                    this.removeTime();
                })

            },
            //查
            selectUser() {
                axios.get(this.serverAddress + 'addUser', this.userInfo).then(p => {
                    console.log(p)
                    this.postUserList();
                    this.removeTime();
                })

            },
            //上传文件
            selectFile(imgFile) {//上传图片或视频
                let param = new FormData();  // 创建form对象
                param.append('avatar', imgFile.files[0])  // 通过append向form对象添加数据
                let config = {
                    headers: {'Content-Type': 'multipart/form-data'}
                }
                axios.post(this.serverAddress + 'uploadFiles', param, config)
                    .then(p => {
                        console.log(p)
                        this.imgArr.push(p.data.ok)
                    })
                    .catch(function (err) {
                        console.log(err)
                    })
            }
            ,//访问其他路由 如user
            getToken() {
                axios.get(this.serverAddress + 'userLogin/getToken?spantime'+(new Date()).valueOf()).then(p => {
                    console.log(p)
                    axios.defaults.headers.common['Authorization'] =p.data.result;
                })
            },
            start(){
             this.tokenTimer=setInterval(() => {
                    // this.getToken();
                    this.addGetUser();
                }, 1000)
            },
            stop(){
                clearInterval(this.tokenTimer)
            }

        },
        created() {
        },
        mounted() {
            // this.getToken();

            var str='lak'
            if(typeof str=='string')
            {
                console.log(typeof str)
            }
            var arr=[]
            console.log(typeof arr)

            var  numbers = [5, 458 , 1200 , -215 ];
            var  maxInNumbers = Math.max.apply(this, numbers);
            console.log(maxInNumbers);  // 458
            var maxInNumbers = Math.max.call(this,5, 458 , 120 , -215);
            console.log(maxInNumbers);  // 458



            var arr = [2,3,4,4,5,2,3,6],
                arr2 = [],
                arr3 = [];
            for(var i = 0;i< arr.length;i++){
                if(arr2.indexOf(arr[i]) < 0){
                    arr2.push(arr[i]);
                }
                else
                {
                    arr3.push(arr[i])
                }
            }
            console.log(arr2);
            console.log(arr3);
        }
    })
</script>
